import React, { PureComponent } from 'react'
import { Modal, Form, Cascader, Input, Upload, Button, message } from 'antd';
import { editCourseware } from '@/services/learn'
export default class AddModal extends PureComponent<any, any> {
    constructor(props: any) {
        super(props)
        this.state = {
            treeData: [],
        }
    }
    changeSubject = (e: any,subject:any) => {
        this.props.changeSubject(e,subject)
    }
    changeInputValue = (e: any, name: string) => {
        this.props.changeInputValue(e, name)
    }
    changeFile = (info: any, name: string) => {
        this.props.changeFile(info, name)
    };
    submitHanle = () => {
        const { doc, cover, subjectValue,subject, sort, name, id, docs, covers } = this.props;
        if (!doc[0] || !cover[0] || !subjectValue || !(sort+'') || !name) return message.error('请完善课件信息')
        editCourseware({
            id, sort, name, subject,
            cover: cover[0].originFileObj ? cover[0].originFileObj : cover[0].name,
            doc: doc[0].originFileObj ? doc[0].originFileObj :  cover[0].name,
            docs: doc[0].originFileObj ? '' : docs, covers: cover[0].originFileObj ? '' : covers
        }).then(res=>{
            if(res.status===1){
                message.success('编辑成功')
                const {hideHandle,getList,searchSubject,currentPage} = this.props;
                hideHandle()
                getList(currentPage,searchSubject);
            }else{
                message.error('编辑失败')
            }
        })
    }
    onPreview=(e:any)=>{
        const { is_jc } = this.props;
        localStorage.setItem('doc',e.url);
        window.open('/pc/index.html#/file/'+e.uid+'/'+is_jc)
    }
    render() {
        const { options, visible, hideHandle, doc, cover, subjectValue, sort, name } = this.props;
        return (
            <Modal visible={visible} title="编辑课件" onCancel={hideHandle} onOk={this.submitHanle}>
                <Form>
                    <Form.Item label="所属类别" required><Cascader  changeOnSelect options={options} onChange={this.changeSubject} value={subjectValue} /></Form.Item>
                </Form>
                <Form>
                    <Form.Item label="课件标题" required><Input onChange={(e: any) => this.changeInputValue(e, 'name')} value={name} /></Form.Item>
                </Form>
                <Form>
                    <Form.Item label="上传课件" required>
                        <Upload onPreview={this.onPreview} beforeUpload={()=>{return false}} accept=".pdf,.mp4,.ppt" onChange={(e) => this.changeFile(e, 'doc')} fileList={doc}>
                            <Button>上传课件</Button>
                        </Upload>
                    </Form.Item>
                </Form>
                <Form>
                    <Form.Item label="上传封面" required >
                        <Upload beforeUpload={()=>{return false}} listType='picture' accept=".jpg,.png" onChange={(e) => this.changeFile(e, 'cover')} fileList={cover}>
                            <Button>上传封面</Button>
                        </Upload>
                    </Form.Item>
                </Form>
                <Form>
                    <Form.Item label="排列序号" required><Input onChange={(e: any) => this.changeInputValue(e, 'sort')} value={sort} /></Form.Item>
                </Form>
            </Modal>
        )
    }
}
